<template>
  <div>
    <div class="summery summery2" style="height: 190px;margin-top: 0px">
      <div class="title">
        <div class="lable">应急指挥信息</div>
        <div class="tit-btn" @click="command">应急指挥
          <img src="../../assets/images/left.png" class='left' alt="">
          <img src="../../assets/images/left_down.png" class='left-down' alt="">
          <img src="../../assets/images/right.png" class='right' alt="">
          <img src="../../assets/images/right_down.png" class='right-down' alt="">
        </div>
      </div>
      <div class="conent">
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg msg2">浙Axxxxx</div>
          <div class="msg msg2">张超</div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg msg2">浙Axxxxx</div>
          <div class="msg msg2">张超</div>
        </div>
        <div class="item">
          <div class="pot">
            <img src="../../../static/point.png" alt="">
          </div>
          <div class="msg msg2">浙Axxxxx</div>
          <div class="msg msg2">张超</div>
        </div>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
    <div class="summery" style="height: 350px">
      <div class="title">
        <div>信息查询</div>
        <div></div>
      </div>
      <div class="conent">
        <form class="from">
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="search-btn">查询
            <img src="../../assets/images/left.png" class='left' alt="">
            <img src="../../assets/images/left_down.png" class='left-down' alt="">
            <img src="../../assets/images/right.png" class='right' alt="">
            <img src="../../assets/images/right_down.png" class='right-down' alt=""></div>
          <div class="clear-btn">清除</div>
        </form>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
    <div class="summery" style="height: 190px">
      <div class="title">
        <div>应急方案查询</div>
        <div></div>
      </div>
      <div class="conent">
        <form class="from" action="">
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="item">
            <label>车辆状态：</label>
            <input type="text">
          </div>
          <div class="search-btn">查询
            <img src="../../assets/images/left.png" class='left' alt="">
            <img src="../../assets/images/left_down.png" class='left-down' alt="">
            <img src="../../assets/images/right.png" class='right' alt="">
            <img src="../../assets/images/right_down.png" class='right-down' alt=""></div>
          <div class="clear-btn">清除</div>
        </form>
      </div>
      <div class='left'>
        <img src="../../assets/images/left.png" alt="">
      </div>
      <div class='left-down'>
        <img src="../../assets/images/left_down.png" alt="">
      </div>
      <div class='right'>
        <img src="../../assets/images/right.png" alt="">
      </div>
      <div class='right-down'>
        <img src="../../assets/images/right_down.png" alt="">
      </div>
    </div>
  </div>
</template>

<script>
  import cBtn from '@/components/botton/onlybtn.vue'
  import bus from '@/eventBus/bus'

  export default {
    name: "summery",
    methods: {
      command() {
        let obj = {
          status: true,
          type: 'inquire'
        }
        bus.$emit('dialogshow', obj)
      }
    },
    components: {
      cBtn
    }
  }
</script>

<style scoped lang="scss">
  .summery2 {
    .conent {
      position: relative;
      padding: 5px 0;
      .item {
        width: 100%;
        height: 40px !important;
        line-height: 40px !important;
        margin-top: 5px;
        position: relative;
      }
    }
  }

  .from {
    .item {
      margin: 0px 10px !important;
      height: 40px !important;
    }

    label {
      float: left;
      flex: 1;
      height: 31px;
      line-height: 31px;
      font-family: '微软雅黑', 'Avenir', Helvetica, Arial, sans-serif;
      text-align: left;
      font-size: .8em;
      letter-spacing: 3px;
      color: #6284a9;
    }
    input {
      height: 31px;
      float: left;
      border: 0;
      background: url("../../components/dialog/img/text.png") no-repeat center;
      background-size: 100% 80%;
      color: #6284a9;
      padding-left: 5px;
      outline: none;
    }
    .search-btn {
      position: relative;
      width: 72px;
      text-align: center;
      float: left;
      height: 30px;
      line-height: 30px;
      padding: 0 8px;
      margin-top: 10px;
      color: #00c0ff;
      border: 1px solid #1B4B98;
      margin-left: 40px;
      .left {
        width: 9px;
        height: 9px;
        position: absolute;
        top: 0px;
        left: 0px;
      }
      .left-down {
        width: 9px;
        height: 9px;
        position: absolute;
        bottom: 0px;
        left: 0px;
      }
      .right-down {
        width: 9px;
        height: 9px;
        position: absolute;
        bottom: 0px;
        right: 0px;
      }
      .right {
        width: 9px;
        height: 9px;
        position: absolute;
        top: 0px;
        right: 0px;
      }
    }
    .clear-btn {
      position: relative;
      width: 72px;
      float: right;
      margin-right: 40px;
      text-align: center;
      height: 30px;
      line-height: 30px;
      padding: 0 8px;
      margin-top: 10px;
      color: #00c0ff;
      border: 1px solid #1B4B98;
    }
  }


</style>
